<template>
  <div id="home">
    <pull-refresh v-model="isLoading" @refresh="refreshGetData">
      <swiper-home :banner="banner"></swiper-home>
      <recommend :recommend="recommend"></recommend>
      <popular></popular>
      <goods></goods>
    </pull-refresh>
  </div>
</template>

<script>
import { get } from "../../helpers/request";
import { PullRefresh, Toast } from "vant";
import swiperHome from "./components/SwiperHome.vue";
import Recommend from "./components/Recommend";
import Popular from "./components/Popular";
import Goods from "./components/Goods";
export default {
  name: "home",
  components: {
    swiperHome,
    PullRefresh,
    Recommend,
    Popular,
    Goods
  },
  data() {
    return {
      banner: [],
      recommend: [],
      isLoading: false
    };
  },
  methods: {
    getData() {
      get("/home/multidata").then(res => {
        this.banner = res.data.banner.list;
        this.recommend = res.data.recommend.list;
      });
    },
    /**下拉刷新 */
    refreshGetData() {
      get("/home/multidata")
        .then(res => {
          Toast("刷新成功");
          this.isLoading = false;
        })
        .catch(error => {
          Toast("刷新失败");
          this.isLoading = false;
          console.log(error);
        });
    }
  },
  created() {
    this.getData();
  }
};
</script>

<style scoped lang="scss">
.van-pull-refresh__track {
  min-height: 100vh;
}
</style>
